<!--Created by daminghu-cli yasenagat# on 2020-05-08 16:28:01-->


<template>
    <div class="fillcontain">

        <div class="table_container">

            <el-form :inline="true" :model="queryForm" ref="queryForm" class="demo-form-inline">


                <el-form-item label="id" prop="id">
                    <el-input v-model="queryForm.id" placeholder="请输入id"></el-input>
                </el-form-item>


                <el-form-item label="任务名称" prop="name">
                    <el-input v-model="queryForm.name" placeholder="请输入任务名称"></el-input>
                </el-form-item>


                <!--<el-form-item label="成功数量" prop="handle_success_log">-->
                    <!--<el-input v-model="queryForm.handle_success_log" placeholder="请输入成功数量"></el-input>-->
                <!--</el-form-item>-->


                <!--<el-form-item label="失败数量" prop="handle_err_log">-->
                    <!--<el-input v-model="queryForm.handle_err_log" placeholder="请输入失败数量"></el-input>-->
                <!--</el-form-item>-->


                <!--<el-form-item label="运行时间" prop="start_time">-->
                    <!--<el-input v-model="queryForm.start_time" placeholder="请输入运行时间"></el-input>-->
                <!--</el-form-item>-->


                <!--<el-form-item label="tps" prop="tps">-->
                    <!--<el-input v-model="queryForm.tps" placeholder="请输入tps"></el-input>-->
                <!--</el-form-item>-->


                <!--<el-form-item label="当前读chan数量" prop="read_chan_num">-->
                    <!--<el-input v-model="queryForm.read_chan_num" placeholder="请输入当前读chan数量"></el-input>-->
                <!--</el-form-item>-->


                <!--<el-form-item label="当前写chan数量" prop="write_chan_num">-->
                    <!--<el-input v-model="queryForm.write_chan_num" placeholder="请输入当前写chan数量"></el-input>-->
                <!--</el-form-item>-->


                <!--<el-form-item label="当前处理完任务的数量" prop="handler_msg_cache_len">-->
                    <!--<el-input v-model="queryForm.handler_msg_cache_len" placeholder="请输入当前处理完任务的数量"></el-input>-->
                <!--</el-form-item>-->


                <!--<el-form-item label="重写队列长度" prop="retry_write_queue_len">-->
                    <!--<el-input v-model="queryForm.retry_write_queue_len" placeholder="请输入重写队列长度"></el-input>-->
                <!--</el-form-item>-->


                <el-form-item label="svrid" prop="svr_id">
                    <el-input v-model="queryForm.svr_id" placeholder="请输入svrid"></el-input>
                </el-form-item>


                <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
                    <el-button type="primary" icon="el-icon-delete" @click="handleClear">清空</el-button>
                </el-form-item>
            </el-form>
            <!--<el-form>-->
                <!--<el-form-item>-->
                    <!--<el-button type="primary" icon="el-icon-plus" @click="handleCreate">立即创建</el-button>-->
                <!--</el-form-item>-->
            <!--</el-form>-->

            <el-table
                ref="queryTable"
                border
                stripe
                :data="tableData"
                @row-click="handleRowClick"
                highlight-current-row
                style="width: 100%">
                <el-table-column type="expand">
                    <template slot-scope="props">
                        <el-form label-position="left" inline class="demo-table-expand">


                            <el-form-item label-width="150px" label="id">
                                <span>{{ props.row.id}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="任务名称">
                                <span>{{ props.row.name}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="成功数量">
                                <span>{{ props.row.handle_success_log}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="失败数量">
                                <span>{{ props.row.handle_err_log}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="运行时间">
                                <span>{{ props.row.run_time}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="tps">
                                <span>{{ props.row.tps}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="当前读chan数量">
                                <span>{{ props.row.read_chan_num}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="当前写chan数量">
                                <span>{{ props.row.write_chan_num}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="当前处理完任务的数量">
                                <span>{{ props.row.handler_msg_cache_len}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="重写队列长度">
                                <span>{{ props.row.retry_write_queue_len}}</span>
                            </el-form-item>


                            <el-form-item label-width="150px" label="svrid">
                                <span>{{ props.row.svr_id}}</span>
                            </el-form-item>


                        </el-form>
                    </template>
                </el-table-column>
                <el-table-column
                    type="index"
                    label="序号"
                    width="80">
                </el-table-column>


                <!--<el-table-column-->
                    <!--property="id"-->
                    <!--label="id"-->
                    <!--width="120">-->
                <!--</el-table-column>-->

                <el-table-column
                    property="name"
                    label="任务名称"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="handle_success_log"
                    label="成功数量"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="handle_err_log"
                    label="失败数量"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="run_time"
                    label="运行时间"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="tps"
                    label="tps"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="read_chan_num"
                    label="当前读chan数量"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="write_chan_num"
                    label="当前写chan数量"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="handler_msg_cache_len"
                    label="当前处理完任务的数量"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="retry_write_queue_len"
                    label="重写队列长度"
                    width="120">
                </el-table-column>

                <el-table-column
                    property="svr_id"
                    label="svrid"
                    width="120">
                </el-table-column>


                <!--<el-table-column label="操作" width="200">-->
                    <!--<template slot-scope="scope">-->
                        <!--&lt;!&ndash;<el-button-->
                            <!--size="mini"-->
                            <!--type="success" icon="el-icon-edit"-->
                            <!--@click="handleQueryOne(scope.$index, scope.row)">查看-->
                        <!--</el-button>&ndash;&gt;-->
                        <!--<el-button-->
                            <!--size="mini"-->
                            <!--type="success" icon="el-icon-edit"-->
                            <!--@click="handleUpdate(scope.$index, scope.row)">编辑-->
                        <!--</el-button>-->
                        <!--<el-button-->
                            <!--size="mini"-->
                            <!--type="danger" icon="el-icon-close"-->
                            <!--@click="handleDelete(scope.$index, scope.row)">删除-->
                        <!--</el-button>-->
                    <!--</template>-->
                <!--</el-table-column>-->
            </el-table>
            <div class="Pagination" style="text-align: left;margin-top: 10px;">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage"
                    :page-size="pageSize"
                    :page-sizes="pageSizes"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="count">
                </el-pagination>
            </div>

            <!--<el-dialog :title="commandDialogTitle" :visible.sync="commandDialogFormVisible">-->
                <!--<el-form :model="commandFormData" :rules="rules" ref="commandForm">-->


                    <!--<el-form-item label="id" prop="id">-->
                        <!--<el-input v-model="commandFormData.id" placeholder="请输入id"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="任务名称" prop="name">-->
                        <!--<el-input v-model="commandFormData.name" placeholder="请输入任务名称"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="成功数量" prop="handle_success_log">-->
                        <!--<el-input v-model="commandFormData.handle_success_log" placeholder="请输入成功数量"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="失败数量" prop="handle_err_log">-->
                        <!--<el-input v-model="commandFormData.handle_err_log" placeholder="请输入失败数量"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="运行时间" prop="start_time">-->
                        <!--<el-input v-model="commandFormData.start_time" placeholder="请输入运行时间"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="tps" prop="tps">-->
                        <!--<el-input v-model="commandFormData.tps" placeholder="请输入tps"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="当前读chan数量" prop="read_chan_num">-->
                        <!--<el-input v-model="commandFormData.read_chan_num" placeholder="请输入当前读chan数量"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="当前写chan数量" prop="write_chan_num">-->
                        <!--<el-input v-model="commandFormData.write_chan_num" placeholder="请输入当前写chan数量"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="当前处理完任务的数量" prop="handler_msg_cache_len">-->
                        <!--<el-input v-model="commandFormData.handler_msg_cache_len"-->
                                  <!--placeholder="请输入当前处理完任务的数量"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="重写队列长度" prop="retry_write_queue_len">-->
                        <!--<el-input v-model="commandFormData.retry_write_queue_len" placeholder="请输入重写队列长度"></el-input>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="svrid" prop="svr_id">-->
                        <!--<el-input v-model="commandFormData.svr_id" placeholder="请输入svrid"></el-input>-->
                    <!--</el-form-item>-->


                <!--</el-form>-->
                <!--<div slot="footer" class="dialog-footer">-->
                    <!--<el-button @click="commandDialogFormVisible = false">取 消</el-button>-->
                    <!--<el-button type="primary" @click="commandUser('commandForm')">确 定</el-button>-->
                <!--</div>-->
            <!--</el-dialog>-->

            <!--<el-dialog :title="queryOneDialogTitle" :visible.sync="queryOneDialogFormVisible">-->
                <!--<el-form :model="queryOneFormData" class="view-dialog">-->


                    <!--<el-form-item label="id">-->
                        <!--<span>{{ queryOneFormData.id }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="任务名称">-->
                        <!--<span>{{ queryOneFormData.name }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="成功数量">-->
                        <!--<span>{{ queryOneFormData.handle_success_log }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="失败数量">-->
                        <!--<span>{{ queryOneFormData.handle_err_log }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="运行时间">-->
                        <!--<span>{{ queryOneFormData.start_time }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="tps">-->
                        <!--<span>{{ queryOneFormData.tps }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="当前读chan数量">-->
                        <!--<span>{{ queryOneFormData.read_chan_num }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="当前写chan数量">-->
                        <!--<span>{{ queryOneFormData.write_chan_num }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="当前处理完任务的数量">-->
                        <!--<span>{{ queryOneFormData.handler_msg_cache_len }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="重写队列长度">-->
                        <!--<span>{{ queryOneFormData.retry_write_queue_len }}</span>-->
                    <!--</el-form-item>-->


                    <!--<el-form-item label="svrid">-->
                        <!--<span>{{ queryOneFormData.svr_id }}</span>-->
                    <!--</el-form-item>-->


                <!--</el-form>-->
            <!--</el-dialog>-->
        </div>
    </div>
</template>

<script>
    import {
        api_readmany_tb_svr_task,
        api_readcount_tb_svr_task, api_deleteone_tb_svr_task,
        api_updateone_tb_svr_task, api_updatexxx_tb_svr_task,
        api_createone_tb_svr_task,
        isResultOk
    } from '@/api/api'
    import {utilFormatMoneyFen2Yuan, utilFormatStrTime} from "../api/util";

    export default {
        data() {
            return {
                commandDialogFormVisible: false,
                commandDialogTitle: 'tb_svr_task',
                commandFormData: {


                    id: '',


                    name: '',


                    handle_success_log: '',


                    handle_err_log: '',


                    start_time: '',


                    tps: '',


                    read_chan_num: '',


                    write_chan_num: '',


                    handler_msg_cache_len: '',


                    retry_write_queue_len: '',


                    svr_id: '',


                },
                commandType: 1,
                queryOneDialogFormVisible: false,
                queryOneDialogTitle: 'tb_svr_task',
                queryOneFormData: {},
                tableData: [],
                offset: 0,
                count: 1000,
                currentPage: 1,
                pageSize: 20,
                pageSizes: [20, 30, 40, 100],
                queryForm: {


                    id: '',


                    name: '',


                    handle_success_log: '',


                    handle_err_log: '',


                    start_time: '',


                    tps: '',


                    read_chan_num: '',


                    write_chan_num: '',


                    handler_msg_cache_len: '',


                    retry_write_queue_len: '',


                    svr_id: '',


                },
                rules: {


                    id: [
                        {required: true, message: "请输入id", trigger: 'blur'},
                    ],


                    name: [
                        {required: true, message: "请输入任务名称", trigger: 'blur'},
                    ],


                    handle_success_log: [
                        {required: true, message: "请输入成功数量", trigger: 'blur'},
                    ],


                    handle_err_log: [
                        {required: true, message: "请输入失败数量", trigger: 'blur'},
                    ],


                    start_time: [
                        {required: true, message: "请输入运行时间", trigger: 'blur'},
                    ],


                    tps: [
                        {required: true, message: "请输入tps", trigger: 'blur'},
                    ],


                    read_chan_num: [
                        {required: true, message: "请输入当前读chan数量", trigger: 'blur'},
                    ],


                    write_chan_num: [
                        {required: true, message: "请输入当前写chan数量", trigger: 'blur'},
                    ],


                    handler_msg_cache_len: [
                        {required: true, message: "请输入当前处理完任务的数量", trigger: 'blur'},
                    ],


                    retry_write_queue_len: [
                        {required: true, message: "请输入重写队列长度", trigger: 'blur'},
                    ],


                    svr_id: [
                        {required: true, message: "请输入svrid", trigger: 'blur'},
                    ],


                },
            }
        },
        components: {},
        created() {
            this.initData();
        },
        methods: {
            async initData() {
                try {
                    this.commandRefresh()
                } catch (err) {
                    console.log('获取数据失败', err);
                }
            },
            handleRowClick(row, column, event) {
                // console.log("handleRowClick : " + row);
            },
            handleQueryOne(index, row) {
                this.queryOneDialogTitle = "查看tb_svr_task"
                this.queryOneDialogFormVisible = true
                this.queryOneFormData = row
            },
            handleDelete(index, row) {

                // console.log(index, row)

                this.$confirm(`删除【 ${ row.id } 】, 是否继续?`, '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'error'
                }).then(() => {
                    this.deleteOne(row.id)
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            async commandUser(formName) {
                try {
                    this.$refs[formName].validate(async (valid) => {
                        if (valid) {
                            // console.log("formdata : ", this.commandFormData)
                            let res = {}
                            //this.commandFormData.id
                            if (this.commandType == 1) {
                                res = await api_updateone_tb_svr_task(this.commandFormData);
                            } else {
                                res = await api_createone_tb_svr_task(this.commandFormData);
                            }
                            if (isResultOk(res)) {
                                this.commandDialogFormVisible = false
                                this.commandRefresh()
                            } else {
                            }
                        } else {
                            this.$message({
                                type: 'error',
                                message: '请输入正确的内容!'
                            });
                        }
                    });
                } catch (err) {
                    this.$message({
                        type: 'error',
                        message: '操作失败!'
                    });
                }
            },
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
                this.pageSize = val
                this.commandReadMany()
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
                this.currentPage = val;
                this.offset = (val - 1) * this.pageSize;
                this.commandReadMany()
            },
            commandRefresh() {
                // this.commandReadCount()
                this.commandReadMany()
            },
            async commandReadMany() {
                const res = await api_readmany_tb_svr_task({
                    offset: this.offset,
                    limit: this.pageSize,


                    // id: this.queryForm.id,

                    name: this.queryForm.name,

                    // handle_success_log: this.queryForm.handle_success_log,
                    //
                    // handle_err_log: this.queryForm.handle_err_log,
                    //
                    // start_time: this.queryForm.start_time,
                    //
                    // tps: this.queryForm.tps,
                    //
                    // read_chan_num: this.queryForm.read_chan_num,
                    //
                    // write_chan_num: this.queryForm.write_chan_num,
                    //
                    // handler_msg_cache_len: this.queryForm.handler_msg_cache_len,
                    //
                    // retry_write_queue_len: this.queryForm.retry_write_queue_len,

                    svr_id: this.queryForm.svr_id,


                });
                if (isResultOk(res)) {
                    this.tableData = res.body.items
                    this.count = res.body.count;
                }
                console.log(this.tableData)
            },
            // async commandReadCount() {
            //     const res = await api_readcount_tb_svr_task({
            //
            //
            //         id: this.queryForm.id,
            //
            //         name: this.queryForm.name,
            //
            //         handle_success_log: this.queryForm.handle_success_log,
            //
            //         handle_err_log: this.queryForm.handle_err_log,
            //
            //         start_time: this.queryForm.start_time,
            //
            //         tps: this.queryForm.tps,
            //
            //         read_chan_num: this.queryForm.read_chan_num,
            //
            //         write_chan_num: this.queryForm.write_chan_num,
            //
            //         handler_msg_cache_len: this.queryForm.handler_msg_cache_len,
            //
            //         retry_write_queue_len: this.queryForm.retry_write_queue_len,
            //
            //         svr_id: this.queryForm.svr_id,
            //
            //
            //     });
            //     if (isResultOk(res)) {
            //         this.count = res.body.count;
            //     } else {
            //     }
            // },
            async deleteOne(id) {
                const res = await api_deleteone_tb_svr_task({

                    id: id

                });
                if (isResultOk(res)) {
                    this.commandRefresh()
                } else {
                }
            },
            handleQuery() {
                console.log('handleQuery!', this.queryForm);
                this.commandRefresh()
            },
            handleClear() {
                this.$refs['queryForm'].resetFields();
                console.log('handleClear!', this.$refs['queryForm'], this.queryForm);
                this.commandRefresh()
            },
            handleCreate() {
                this.commandDialogFormVisible = true
                this.commandType = 2
                this.commandDialogTitle = "创建tb_svr_task"
                this.commandFormData = {}
                console.log("handleCreate : ")
            },
            handleUpdate(index, row) {
                this.commandDialogFormVisible = true
                this.commandType = 1
                this.commandDialogTitle = "修改tb_svr_task"
                this.commandFormData = row
                console.log("handleUpdate : ")
            },
            formatColumnCreateTime(row, column, cellValue, index) {
                return utilFormatStrTime(cellValue)
            },
            formatColumnMoney(row, column, cellValue, index) {
                return this.formatMoney(cellValue)
            },
            formatMoney(str) {
                return utilFormatMoneyFen2Yuan(str)
            },
            formatStrTime(str) {
                return utilFormatStrTime(str)
            },
        },
    }
</script>

<style lang="less">
    @import '../style/mixin';

    .table_container {
        padding: 20px;
    }


</style>
